<template>
  <BasicModal
    @register="register"
    title="提交失败"
    width="800px"
    :canFullscreen="false"
    :showOkBtn="false"
    :showCancelBtn="false"
    :afterClose="afterClose"
  >
    <div class="warp">
      <span class="name" v-for="(v, i) in list" :key="i">
        <span class="k">{{ i + 1 }}.{{ v.name }}：</span>
        <span class="v">{{ v.msg }}</span>
        <span>；</span>
      </span>
    </div>
  </BasicModal>
</template>

<script lang="ts" setup>
  import { IErrMsg } from '@/api/version/type';
  import { BasicModal, useModalInner } from '@/components/Modal';
  import { ref } from 'vue';

  const emit = defineEmits(['close']);

  const list = ref<IErrMsg[]>([]);

  const [register] = useModalInner((data) => {
    console.log('data--->', data);
    list.value = data.list;
  });

  function afterClose() {
    emit('close');
  }
</script>

<style lang="less" scoped>
  .warp {
    display: flex;
    flex-wrap: wrap;
    .name {
      .k {
      }
      .v {
        color: red;
      }
    }
  }
</style>
